<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>经营数据</title>
    <link rel="stylesheet" href="/public/admin/css/layui.css"  media="all">
    <script src="/public/admin/echarts.simple.min.js"></script>
    <script src="/public/index/css/jquery.min.js"></script>
    <script src="/public/admin/adminlink.js"></script>
    <!-- 获取cookie脚本 -->
    <script src="/public/index/css/jquery.cookie.js"></script>
    <style>
        .grid-demo{
            background: #79C48C;
            height: 70px;
            line-height: 24px;
            padding-top: 30px;
            text-align: center;
            font-size: 18px;
        }
        .grid-demo-bg1{
            background: #63BA79;
        }

        .phrigt{
            float: right;
            font-size: 12px;
            color: #B2B2B2;
        }

    </style>
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo">海贼王米线</div>

        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item"><a href="/adminout">退出</a></li>
        </ul>
    </div>

    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll">
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-tree"  lay-filter="test">
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="" href="javascript:;">数据管理</a>
                </li>
                <li class="layui-nav-item">
                    <a class="" href="javascript:;">米线管理</a>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;">订单管理</a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;">未接单</a></dd>
                        <dd><a href="javascript:;">已接单</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;">配送员管理</a>
                </li>
            </ul>
        </div>
    </div>

    <div class="layui-body">
        <!-- 内容主体区域 -->
        <div style="padding: 15px;">
            <div class="layui-row">
                <div class="layui-col-xs3">
                    <div class="grid-demo grid-demo-bg1">
                        订单总量<br>
                        <span id="orcount"></span>份
                    </div>
                </div>
                <div class="layui-col-xs3">
                    <div class="grid-demo">
                        今日订单<br>
                        <span id="dayorcount"></span>份
                    </div>
                </div>
                <div class="layui-col-xs3">
                    <div class="grid-demo grid-demo-bg1">
                        总业绩<br>
                        10000元
                    </div>
                </div>
                <div class="layui-col-xs3">
                    <div class="grid-demo">
                        今日业绩<br>
                        120元
                    </div>
                </div>
            </div>
            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                <legend>七日业绩走势</legend>
            </fieldset>
            <div id="main" style="width: 100%;height:400px;"></div>
            <div class="layui-row layui-col-space10">
                <div class="layui-col-xs4">
                    <div class="layui-form">
                        <table class="layui-table">
                            <colgroup>
                                <col>
                                <col>
                            </colgroup>
                            <thead>
                            <tr>
                                <th>销量排行</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>
                                    <span>鱼丝米线</span>
                                    <span class="phrigt">1000份</span>
                                </td>
                            </tr>

                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="layui-col-xs4">
                    <div class="layui-form">
                        <table class="layui-table">
                            <colgroup>
                                <col>
                                <col>
                            </colgroup>
                            <thead>
                            <tr>
                                <th>忠实用户</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>
                                    <span>令狐冲</span>
                                    <span class="phrigt">100份</span>
                                </td>
                            </tr>

                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="layui-col-xs4">
                    <div class="layui-form">
                        <table class="layui-table">
                            <colgroup>
                                <col>
                                <col>
                            </colgroup>
                            <thead>
                            <tr>
                                <th>明星配送员</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>
                                    <span>任盈盈</span>
                                    <span class="phrigt">2000份</span>
                                </td>
                            </tr>

                            </tbody>
                        </table>
                    </div>
                </div>

            </div>

        </div>

    </div>

    <div class="layui-footer">
        <!-- 底部固定区域 -->
        海贼王米线，欢迎您品尝。
    </div>
</div>
<script>
    $(document).ready(function(){
        if(!$.cookie('adminname')){
            location.href="/admin_login";
        }else {
            //业绩数据
            $.get("/admin_count",function(data){
                $("#orcount").text(data[0].ordercount);
                $("#dayorcount").text(data[1].daycount);
            });

            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('main'));

            // 指定图表的配置项和数据
            var option = {
                xAxis: {
                    type: 'category',
                    data: ['2019-2-1', '2019-2-2', '2019-2-3', '2019-2-4', '2019-2-5', '2019-2-6', '2019-2-7']
                },
                yAxis: {
                    type: 'value'
                },
                series: [{
                    data: [820, 932, 901, 934, 1290, 1330, 1320],
                    type: 'line'
                }]
            };
            $.get("/admin_seven",function(data){
                //重构数据
                option.xAxis.data=data[0].sevenday;
                option.series.data=[820, 932, 901, 934, 1290, 1330, 1320];
                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);
            });


        }
    });
</script>

<script src="/public/admin/layui.all.js" charset="utf-8"></script>

</body>
</html>